<template>
  <view class="content">
    <!-- <view class="search">
    <input type="text" model:value="{{cha}}" placeholder="请输入会员id" />
    <button bindtap="phone" class="button">搜索</button>
  </view> -->
    <view class="nav">
      <view :class="index === data.navnum ? 'sel nav_item' : 'nav_item'" v-for="(item, index) in data.nav" :key="index" @click="navtap(index)">
        {{ item.name }}
      </view>
    </view>
    <view class="list">
      <view class="item" v-for="(item, index) in data.list" :key="index">
        <view class="title">
          <view class="l shopname">订单号：{{ item.mchReturnNo }}</view>
          <view class="l shopname">会员ID：{{ item.orderMemberBO.mchMemberNo }}</view>
          <view class="r stats">{{ retsta(item.status) }}</view>
        </view>
        <view class="goods">
          <view class="good_item" v-for="(items, indexs) in item.ordersReturnItemBOList" :key="indexs">
            <view class="good_info l">
              <view class="good_name">{{ items.skuName }}</view>
              <view class="good_specs">{{ items.closeReason || '无备注' }}</view>
            </view>
            <view class="good_cp r">
              <view class="good_price">￥{{ items.amount }}</view>
              <view class="good_count">共{{ items.goodsCount }}件</view>
            </view>
          </view>
        </view>
        <view class="good_name">退款理由：{{ item.closeReason || '无备注' }}</view>
        <view style="overflow: hidden">
          <view class="time l">购买时间：{{ item.createdDate }}</view>
          <view class="good_pay r">
            <text>{{ retsta(item.payType) }}</text>
            <text style="font-size: 28rpx; color: #28282b">退款金额：￥{{ item.returnAmount }}</text>
          </view>
        </view>
        <view class="examine" v-if="item.status === 'AWAITING_MODERATION'">
          <view class="examine_item" @click="pass(item.id)">通过</view>
          <view class="examine_item" @click="no_pass(item.id)">不通过</view>
        </view>
      </view>
    </view>
  </view>
</template>

<script lang="ts" setup>
import { err, toast } from '@/utils/uniapi';
import { retsta } from '@/utils/utils';
import { reactive } from 'vue';
import { onLoad, onReachBottom } from '@dcloudio/uni-app';
import { api } from '@/api/mop_api';
const data = reactive({
  page: 1,
  size: 20,
  list: [],
  pageTotal: 0,
  nav: [
    { name: '全部', status: '' },
    { name: '待审核', status: 'AWAITING_MODERATION' },
    { name: '审核通过', status: 'PASS_AUDIT' },
    { name: '售后完成', status: 'RETURN_SUCCESS' },
    { name: '售后关闭', status: 'CLOSE' }
  ],
  navnum: 0,
  cha: ''
});
onLoad(() => {
  pay_return_list();
});
function navtap(i: any) {
  try {
    data.navnum = i;
    data.list = [];
    data.page = 1;
    if (i === 0) {
      pay_return_list();
    } else {
      const sta = data.nav[i].status;
      status_list(sta);
    }
  } catch (error) {
    err(error);
    throw error;
  }
}
async function status_list(status: string) {
  try {
    const { page, size, list } = data;
    const datas = { status };
    const res = await api.payrefundList({ page, size, data: datas });
    if (res.respCode === 200) {
      const newlist = JSON.parse(res.source);
      data.pageTotal = res.pageTotal;
      const updatedOdlist = list.length === 0 ? newlist : list.concat(newlist);
      data.list = updatedOdlist;
    }
  } catch (error) {
    err(error);
  }
}
async function pay_return_list() {
  try {
    const { page, size, list } = data;
    const res = await api.payrefundList({
      page,
      size,
      data: undefined
    });
    if (res.respCode === 200) {
      const newlist = JSON.parse(res.source);
      const pageTotal = res.pageTotal;
      const updatedOdlist = list.length === 0 ? newlist : list.concat(newlist);
      (data.list = updatedOdlist), (data.pageTotal = pageTotal);
	  console.log(updatedOdlist)
    }
  } catch (error) {
    err(error);
    throw error;
  }
}
function pass(e: any) {
  try {
    const status = 'PASS_AUDIT';
    wx.showModal({
      title: '请输入审核通过原因',
      editable: true,
      complete: async (res: any) => {
        if (res.confirm) {
          const datas = {
            id: e,
            status,
            closeReason: res.content
          };
          const { respCode, msg } = await api.payrefund(datas);
          if (respCode === 200) {
            data.list = [];
            data.page = 1;
            pay_return_list();
            toast('审核通过');
          } else {
            toast(msg);
          }
        }
      }
    });
  } catch (error) {
    err(error);
    throw error;
  }
}
function no_pass(e: any) {
  const status = 'CLOSE';
  try {
    wx.showModal({
      title: '请输入审核不通过原因',
      editable: true,
      complete: async (res: any) => {
        if (res.confirm) {
          const datas = {
            id: e,
            status,
            closeReason: res.content
          };
          const ress = await api.payrefund(datas);
          if (ress.respCode === 200) {
            data.list = [];
            data.page = 1;
            pay_return_list();
            toast('审核不通过');
          } else {
            toast(res.msg);
          }
        }
      }
    });
  } catch (error) {
    err(error);
    throw error;
  }
}
onReachBottom(() => {
  const { list, pageTotal, page } = data;
  if (list.length < pageTotal) {
    data.page = page + 1;
    pay_return_list();
  } else {
    toast('已加载全部数据');
  }
});
</script>

<style scoped>
.search {
  width: 100%;
  height: 100rpx;
  overflow: hidden;
  margin-top: 20rpx;
}
input {
  width: 600rpx;
  height: 80rpx;
  background: #ffffff;
  border-radius: 27rpx 27rpx 27rpx 27rpx;
  border: 2rpx solid #d8d8d8;
  padding: 0 20rpx;
  box-sizing: border-box;
  display: block;
  float: left;
  margin-left: 10rpx;
}
.button {
  padding: 0;
  margin: 0;
  width: 130rpx;
  height: 80rpx;
  background: #e30514;
  font-size: 32rpx;
  font-family: Source Han Sans CN-Regular, Source Han Sans CN;
  font-weight: 600;
  color: #ffffff;
  line-height: 80rpx;
  display: block;
  float: right;
  margin-right: 10rpx;
}
.nav {
  width: 100%;
  height: 90rpx;
  border-radius: 0rpx 0rpx 0rpx 0rpx;
  opacity: 1;
  background-color: #ffffff;
  margin-top: 2rpx;
  display: flex;
}
.nav_item {
  flex: 1;
  text-align: center;
  line-height: 90rpx;
  font-family: Inter-Regular, Inter;
  font-weight: 400;
  color: #808089;
}
.sel {
  font-family: Source Han Sans CN-Bold, Source Han Sans CN;
  font-weight: 700;
  color: #000;
  border-bottom: 4rpx solid #ffcc00;
}
.item {
  width: 690rpx;
  min-height: 200rpx;
  margin: 10rpx auto;
  background-color: #ffffff;
}
.item {
  width: 710rpx;
  background: #ffffff;
  border-radius: 24rpx 24rpx 24rpx 24rpx;
  opacity: 1;
  margin: 24rpx auto;
  padding: 16rpx 40rpx 30rpx 14rpx;
  box-sizing: border-box;
}
.title {
  width: 656rpx;
  overflow: hidden;
  padding-bottom: 8rpx;
  border-bottom: 2rpx solid #ebebf0;
  margin: 0 auto;
}
.shopname {
  font-size: 24rpx;
  font-family: Inter-Regular, Inter;
  font-weight: 400;
  color: #28282b;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-right: 20rpx;
}
.stats {
  font-size: 28rpx;
  font-family: Inter-Regular, Inter;
  font-weight: 400;
}
.goods {
  width: 656rpx;
  margin: 0 auto;
  border-bottom: 2rpx solid #ebebf0;
}
.good_item {
  margin-top: 12rpx;
  width: 100%;
  height: 108rpx;
  overflow: hidden;
}
.good_info {
  width: 292rpx;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  margin-left: 18rpx;
}
.good_name {
  font-size: 28rpx;
  font-family: Inter-Regular, Inter;
  font-weight: 400;
  color: #28282b;
  line-height: 42rpx;
}
.good_specs {
  font-size: 24rpx;
  font-family: Source Han Sans CN-Regular, Source Han Sans CN;
  font-weight: 400;
  color: #999999;
  line-height: 42rpx;
}
.good_cp {
  line-height: 42rpx;
}
.good_price {
  font-size: 28rpx;
  font-family: Source Han Sans CN-Regular, Source Han Sans CN;
  font-weight: 400;
  color: #3d3d3d;
}
.good_count {
  font-size: 24rpx;
  font-family: Source Han Sans CN-Regular, Source Han Sans CN;
  font-weight: 400;
  color: #999;
}
.time {
  font-size: 20rpx;
  font-family: Source Han Sans CN-Regular, Source Han Sans CN;
  font-weight: 400;
  color: #999999;
  line-height: 42rpx;
}
.good_pay {
  text-align: right;
  font-size: 24rpx;
  font-family: Source Han Sans CN-Regular, Source Han Sans CN;
  font-weight: 400;
  color: #999999;
  line-height: 42rpx;
}
.examine {
  width: 100%;
  display: flex;
  justify-content: space-around;
  margin-top: 10rpx;
}
.examine_item {
  width: 250rpx;
  height: 60rpx;
  line-height: 60rpx;
  text-align: center;
  background-color: #ffcc00;
  border-radius: 20rpx;
}
</style>
